<template>
  <div>
    <Header></Header>
    <div class="main mar-20">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item><a href="/">活动管理</a></el-breadcrumb-item>
      </el-breadcrumb>
    </div>

    <!--焦点区-->
    <div class="main mar-20">
      <el-row :gutter="15">
        <el-col :span="16">
          <el-card style="min-height: 1200px;overflow:visible;">
            <div slot="header" class="clearfix">
              <span>职位推荐</span>
            </div>
            <!--<r-query-form :form="form" :items="items" @search="search"></r-query-form>-->
            <ul class="post-list">
              <li v-for="(item,index) in posts" :key="index">
                <a href="#">
                  {{item.name}}
                  <span style="float: right">
                                        <el-button type="primary" @click="send(item.id,item.companyId)" size="mini" round>申请职位</el-button>
                                        <el-button type="danger"  @click="favor(item.id,item.companyId)"  size="mini" round>收藏</el-button>
                                    </span>
                </a>
                <p>
                  <span>{{item.salary}}</span>
                  <span>{{item.type}}</span>
                  <span>{{item.education}}</span>
                  <span>{{item.size}}</span>
                  <span>{{item.companyName}}</span>
                </p>
              </li>
            </ul>
            <!--<el-pagination
                background
                layout="prev, pager, next,total"
                @current-change="handleCurrentChange"
                :total="total">
            </el-pagination>-->
          </el-card>
        </el-col>
        <el-col :span="8">
          <Hot></Hot>
        </el-col>
      </el-row>
    </div>
    <Footer></Footer>

  </div>

</template>

<script>
  import '../assets/css/styles.css'
  import Header from "./Header";
  import Footer from "./Footer";
  import Hot from "./Hot";
  import {recommend_query} from "@/api/front";
  import {send_create} from "@/api/send";
  import {favor_create} from "@/api/favor";
  import local from "@/store/local";
  import {message} from "@/utils/message";
  import {dict_query} from "@/api/front";

  export default {
    name: "Recommend",
    components: {Hot, Footer, Header},
    data(){
      return {
        posts:[],
        total:0,
        form:{
          name:'',
        },
        items:[
          {type:'text',label:'职位',name:'name',placeholder:'职位关键字搜索'},
        ],
      }
    },
    mounted() {
      this.getPostList({});
      this.getDictList(2,"education");
      this.getDictList(4,"type");
      this.getDictList(3,"salary");
      this.getDictList(5,"size");
    },
    methods:{
      getDictList(typeId,name){
        dict_query({typeId:typeId}).then(res=>{
          let arr = [];
          res.data.forEach(item=>{
            let p = {value:item.dictKey,label:item.dictVal};
            arr.push(p);
          });
          this.items.forEach(item=>{
            if(item.type=='select' && item.name == name){
              item.options= arr;
            }
          })
        })
      },
      handleCurrentChange(page){
        let param =  this.form;
        param.page = page;
        this.getPostList(param);
      },
      search(){
        let param = this.form;
        this.getPostList(param);
      },
      getPostList(param){
        recommend_query(param).then(res=>{
          this.posts = res.data;
          this.total = res.total;
          console.log(this.posts)
        });
      },
      send(postId,companyId){
        if(local.getToken()){
          if(local.getUserInfo().type == 2){
            //执行申请
            send_create({postId:postId,companyId:companyId}).then(res=>{
              message.success(res.msg);
            })
          }else{
            message.error("非学生登录不能申请");
          }
        }else{
          message.error("请先登录");
        }
      },
      favor(postId,companyId){
        if(local.getToken()){
          if(local.getUserInfo().type == 2){
            //执行申请
            favor_create({postId:postId,companyId:companyId}).then(res=>{
              message.success(res.msg);
            })
          }else{
            message.error("非学生登录不能收藏");
          }
        }else{
          message.error("请先登录");
        }
      }

    }
  }
</script>

<style scoped>

</style>